Cascading Menus

Menus can be accessed during runtime with a special Cascading Menu block.  This type of block mimics the menu structure set up in the Menu Information section of the Xephr Studio to display all of the menus and their menu entries starting with the defined menu root in a single block.  Cascading menu blocks are often created on screen templates.

You can only have one cascading menu displayed per screen.

See Also

Menu Objects

Xephr Menu Service for Standard Blocks

Menu Examples

Requirements for Cascading Menus

Cascading Menu Operation

Creating Cascading Menus

Modifying Cascading Menus

Requirements for Cascading Menus

In order to use cascading menus, you must have:

If you are planning on displaying different menus based on a global value assigned to users, you will need to create one cascading menu block per global value.  Then, use the hide if/show if properties for the block to indicate when it's displayed.  

Cascading Menu Operation

You can only have one cascading menu displayed per screen.

Once you have set up a cascading menu block, the first set of menus/menu entries below the menu root will be displayed in the block, either vertically or horizontally, depending on the block set up.  When you move your mouse over the menus, the entries on the menu will be displayed.  When you click on a menu entry, the entity for that menu entry will be run.

Cascading menus can be set up as floating so that when you scroll in the browser screen, the menu will remain in the same general place in the browser.  For example, if you were scrolling down, the menu would remain at the top of the browser screen by jumping downward every time you scroll.

In the following examples, the menu set up looks as follows.  The menu root is MM.

Horizontal Cascading Menu

In this example, the arrowimagemain.gif is the arrow pointing down that is displayed at the top level, and the arrowimagesub.gif is the arrow pointing to the right on the submenu.

This cascading menu block  is set up with the Vertical Cascade property set to false, and the Floating Menus property set to false.

Vertical Cascading Menu

In this example, the arrowimagemain.gif is the arrow pointing to the right that is displayed at the top level, and the arrowimagesub.gif is the arrow pointing down on the submenu.

This cascading menu block  is set up with the Vertical Cascade property set to true, and the Floating Menus property set to false.

Creating Cascading Menu Blocks

  1. Create a screen or locate an existing screen to which you wish to add a cascading menu block in the Explorer Tree.

  1. There are options in adding the block to the screen at this point.

  1. The Adding New Block screen will be displayed.

  2. In the Create block similar to pop-list, select (none).

  3. In the Block Name property, enter the name of the cascading menu block.

  4. In the Block Type pop-list, select Cascading Menu.

  5. Select the mode(s) in which this block will be displayed for this screen.  There are four flags here, one for each mode - QBE, List, Edit, New.  For each mode in which you wish the block to be displayed, set the flag to on.  For each mode in which you do not wish the block to be displayed, set the flag to off.

  6. Click on the Next button to continue.

  7. Click on the Next button at the bottom right of the screen to continue.

  8. At this point a new screen is displayed.  If you wish to add another block, set the Add Block or Labels flag to on and press the Next button.  

  1. Otherwise, press the Finish button in the bottom right of the screen.

Additional modifications need to be made to the block before the cascading menu block will work.

Modifying Cascading Menu Blocks

  1. In the Explorer Tree, locate the object for which you wish to modify a block.  

  1. Expand the screen and select the block that you wish to modify.

  2. Display the block properties.  These will either be displayed in Alphabetical or Logically, depending on the setting of the [Sort Alphabetically/Logically] button.  The following instructions are assuming that the properties are sorted logically.

  3. In the Name property, the name entered during block creation is displayed, and can be changed, if desired.

  4. In the Description property, enter the user-defined description for the block.

  5. In the Parent pop-list, if the parent of this block is another block, the parent block is displayed, grayed out.  Otherwise, this pop-list is set to (entity root).

  6. In the Type pop-list, the original setting from the block creation will be displayed, and should be set to Cascading Menu.

  7. In the Mutability pop-list, select whether this block can be modified on screens that are created from this template.  This option is ONLY available for template screens.

  1. In the Menu Root pop-list, select the menu name for the top level menu that will be displayed on this cascading menu block.  You can only select from menus that already exist in the Menu Information section of the Xephr Studio.

  2. Set the Vertical Cascade pop-list to the desired setting.  When set to false, the menus and menu entries below the menu root will be displayed horizontally from left to right on the screen.  When set to true, the menus and menu entries below the menu root will be displayed vertically from top to bottom on the screen.

  3. Set the Floating Menus pop-list to the desired setting.  When set to false, the cascading menu will remain in the same place on the screen.  When set to true, the cascading menu will 'float' in the same place in the browser when you are scrolling within the browser.  For example, if the cascading menu were at the top of the screen, and you scrolled down, the cascading menu block would jump down to remain at the top of the browser while you scroll.

  4. Set the Body Style pop-list to the style to be applied to the body for this block.  If set to (from parent), the style used will be the Body Style from the screen properties.

  5. Set the Editable Field Style pop-list to the style to be applied by default to the editable fields for this block.  If set to (from parent), the style used will be the Editable Field Style from the screen properties.

  6. Set the Non- Editable Field Style pop-list to the style to be applied by default to the display only and label fields for this block.  If set to (from parent), the style used will be the Non- Editable Field Style from the screen properties.

  7. Set the Link Style pop-list to the style to be applied to hyperlinks for this block.  If set to (from parent), the style used will be the Link Style from the screen properties.

  8. In the X property, the location in pixels is displayed for the top left corner of this block or field on the X-axis (horizontal) of the layout screen.  You can change this number manually, or it will be changed when you are altering the layout with the Designer Tool.

  9. In the Y property, the location in pixels is displayed for the top left corner of this block or field on the Y-axis (vertical) of the layout screen.  This value is used in conjunction with the Y Anchor Type setting.  You can change this number manually, or it will be changed when you are altering the layout with the Designer Tool.

  10. In the Y Anchor Type pop-list, select the anchor type for this block.  Choices are Fixed and Relative to Block..

  1. In the Y Anchor property, select the block or field that will be used to determine the location of the block on the Y-axis.  The property is only displayed when the Y Anchor Type pop-list is set to Block.

  2. In the Width property, enter the width for the block in pixels.

  3. In the Height property, enter the height for the block in pixels.

  4. In the Expand Type pop-list, define the size of the block.  Choices are Expandable, Fixed No Scroll Bars, and Fixed with Scroll Bars.

  1. In the Hide If property, enter the conditions under which this block will be hidden.  The field will be visible on the block when the conditions are met.  When an entry is made in this property, the Show If property will be hidden.

  1. In the Show If property, enter the conditions under which this block will be displayed.  The block will be hidden when the conditions are met.  When an entry is made in this property, the Hide If property will be hidden.

  1. In the Show if Empty pop-list, determine whether the block will be displayed when it is empty.  When set to true, the block will be displayed on the screen even when it contains no data.  When set to false, the block will be hidden when it contains no data.

  2. In the Z Order property, enter a number to define the order in which the block will be generated on the entity.  The higher the number, the later the block will be generated.  The Z order is specific to the indention level in the entity tree, and is affected by the Y Anchor and Anchor Type properties.   

    For blocks with a Tab Block as the parent block, this number determines in which order the tabs will be displayed within the tab block.  

  3. The Created on property displays the date and time on which this block was created and cannot be changed.

  4. The Modified on property displays the date and time on which this block was last changed and cannot be modified.

  5. When all changes have been made, press the [Save] button in the Main Toolbar.